<template>
    <div class='crematedScane'>
        <div class='content'>
            <div v-for="(item,index) in msg" :key="index" :class="item.class">
                {{item.text}}
            </div>
        </div>
        <div class='footer'>
            <div class='sn'>
                <el-input v-model="input" placeholder="请扫描二维码" autofocus=true @keyup.enter.native="sance()" id="search"></el-input>
            </div>
            <div class='button'> 
                <el-button type="danger" @click="closes()">关闭</el-button>
            </div>
        </div>
    </div>
</template>
<script>
export default {
    data(){
        return{
            input:'',
            step:1,
            sCode:"",
            sCode2:"",
            href:"",
            appid:"",
            msg:[{
                text:"请扫描领取卡二维码...",
                class:"item"
            }]
        }
    },
    created(){
         if(this.$route.query.appid){
            this.appid=this.$route.query.appid;
        }
        this.href = window.location.href; /* 获取完整URL */
         window.setInterval(function(){
            document.getElementById("search").focus();
        },2000)
    },
    methods:{
        sance(){
           
            if(this.step==1){
                this.sCode=this.input;
                let data_={};
                data_.text="领取卡二维码:"+this.sCode;
                data_.class="item2"
                this.msg.push(data_);

                this.$post(this.appid,"byg/ashes/readGHH",{sCode:this.sCode}).then(data=>{
                    if(unescape(data[0].status=="+OK")){
                        data_={};
                        data_.text="骨灰盒："+unescape(data[0].msg);
                        data_.class="item2"
                        this.msg.push(data_);
                        
                        data_={};
                        data_.text="请扫描骨灰盒标签...";
                        data_.class="item"
                        this.msg.push(data_);
                        this.step=2;
                        
                    }else{
                        data_={};
                        data_.text=unescape(data[0].msg);
                        data_.class="item3"
                        this.msg.push(data_);
                    }
                });
               
            }else if(this.step==2){
                this.sCode2=this.input;
                let data_={};
                data_.text="骨灰盒标签:"+this.sCode2;
                data_.class="item2"
                this.msg.push(data_);

                if(this.sCode==this.sCode2){
                    data_={};
                    data_.text="正在进行骨灰领取操作，请稍等...";
                    data_.class="item2"
                    this.msg.push(data_);
                    
                    this.$post(this.appid,"byg/ashes/saveAshes",{sCode:this.sCode}).then(data=>{
                        let data_={};
                        data_.text=unescape(data[0].msg);
                        if(data[0].status=="+OK"){
                            data_.class="item3";
                            this.msg.push(data_);
                            
                            data_={};
                            data_.type="goSearch";
                            data_.url=this.href;
                            //parent.postMessage(JSON.stringify(data_),'*');
                            this.$emit("goSearch",JSON.stringify(data_))
                            
                            data_={};
                            data_.text="请扫描领取卡二维码...";
                            data_.class="item"
                            this.msg.push(data_);
                        }else{
                            data_.class="item3";
                            this.msg.push(data_);
                        }
                        this.step==1;

                    
                    });
                }else{
                    data_={};
                    data_.text="骨灰盒领取卡和领取卡二维码对不上，请检查！";
                    data_.class="item3"
                    this.msg.push(data_);
                    data_={};
                    data_.text="请扫描领取卡二维码";
                    data_.class="item"
                    this.msg.push(data_);
                    this.step==1;
                }
                
                
            }
                
            
            this.input="";
        },
        closes(){
            let data_={};
            data_.type="close";
            this.$emit("closeWin",JSON.stringify(data_))
            parent.postMessage(JSON.stringify(data_),'*');
        }
    }
}
</script>
<style scoped>
.crematedScane{
    width:100%;
    height:100%;
    display:flex;
    flex-direction: column;
}
.content{
    flex:1;
    padding:10px;
}
.footer{
    height:40px;
    padding:10px;
    border-top:1px solid #ddd;
    display:flex;
    flex-direction: row;
}
.sn{
    width:280px;

}
.button{
    text-align: center;
    flex:1;
}
.item{
    color:rgb(107, 119, 224);
}
.item2{
    color:green;
}
.item3{
    color:red;
}
</style>